<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--doctype html-->
<html lang="en"
      xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:a4j="http://richfaces.org/a4j"      
      xmlns:f="http://java.sun.com/jsf/core"      
      >
    
     <style>
        .gridhello {
            border-collapse : collapse;
        }
        .gridhellocolumn {
            padding-left : 0;
        }
        .outhello {
            font-weight: bold;
        }
    </style>
    
    
<h:head>
	<title>CoffeeCols</title>
	<link rel="stylesheet" href="styles.css" type="text/css" media="screen" />
	<link rel="stylesheet" type="text/css" href="print.css" media="print" />
        <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
        <script type="text/javascript" src="js/equalcolumns.js"></script> 
	<!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
</h:head>
<h:body> 
        
    

	<header>
		<h1>CoffeePatterns</h1>
	</header>
	<nav>
		<ul>
			<li class="selected"><a href="#">Home</a></li>
			<li><a href="Acount.xhtml">Ordenar Bebida</a></li>
			
		</ul>
	</nav>
	<section id="intro">
		<header>
			<h2>Patrones de Diseño</h2>
		</header>
		<p>Patrones de diseño, para la clase de Analisis y Diseño de sistemas 2.</p>
		<img src="images/introimage.png" alt="lime" />
	</section>
	
	<section id="content">
				<ul class="column">
                                    
                                    
                                    
                                    <h:form >  
                                        
                                        <rich:panel header =" Descripcion ">
                                             <p>Los patrones de Diseño usados para esta practica son:</p>
                                             
                                             <h2>
                                                <a href="http://www.allapplabs.com/java_design_patterns/decorator_pattern.htm">Decorator Pattern</a>
                                                <a href="http://www.allapplabs.com/java_design_patterns/iterator_pattern.htm">Iterator Pattern</a>
                                             </h2>
                                             
                                             <BR></BR>
                                             <p>Siendo el primero un Structural Pattern y el segundo Behavioral Pattern</p>
                                             <p>La Aplicacion consiste en poder eleguir una bebida y agregarle otres ingredientes, esta parte es manejada por el patron "DECORATOR", 
                                             el patron "ITERATOR" es usado en el paso final donde se muestra la bebida final, el cual se muestran los ingredientes</p>
                                             <p>Ademas se uso JSF y richfaces para esta practica</p>
                                             
                                             <p>Se adjunta una imagen y se resaltan las clases principales de cada patron</p>
                                             
                                             <p>Tambien el link del codigo fuente:</p>
                                             
                                             <h2>
                                                <a href="http://code.google.com/p/wpatterns/source/list">Codigo fuente de la aplicacion</a>
                                               
                                             </h2>
                                             <img src="images/Patrones.PNG" alt="lime" />
                                             </rich:panel>
                                        
                                    </h:form>
                                                
                                    
                                    
				    <!--eqblock-->
				    <li>
				        <section class="block">
									<a href="#"><img src="images/1-thumb.jpg" alt=""  /></a> 
										<h2><a href="#">Coffee 101</a></h2> 
										<p>Proin metus odio, ultricies eu pharetra dictum, laoreet id odio. Curabitur in odio augue. Morbi congue auctor interdum. Phasellus sit amet metus justo. </p> 
				        </section>
				    </li>

				    <!--eqblock-->
				    <li>
				        <section class="block">
									<a href="#"><img src="images/2-thumb.jpg" alt=""  /></a> 
										<h2><a href="#">All About Beans</a></h2> 
										<p>Morbi congue auctor interdum. Proin metus odio, ultricies eu pharetra dictum, laoreet id odio. Curabitur in odio augue. Phasellus sit amet metus justo. </p> 
				        </section>
				    </li>

				    <!--eqblock-->
				    <li>
				        <section class="block">
									<a href="#"><img src="images/3-thumb.jpg" alt=""  /></a> 
										<h2><a href="#">Compatible Foods</a></h2> 
										<p>Phasellus sit amet metus justo. Proin metus odio, ultricies eu pharetra dictum, laoreet id odio. Curabitur in odio augue. Morbi congue auctor. </p> 
				        </section>
				    </li>

				    <!--eqblock-->
				    <li>
				        <section class="block">
									<a href="#"><img src="images/4-thumb.jpg" alt=""  /></a> 
										<h2><a href="#">Coffee Sizzle</a></h2> 
										<p>Proin metus odio, ultricies eu pharetra dictum, laoreet id odio. Morbi congue auctor interdum. Curabitur in odio augue. Phasellus sit amet metus justo. </p> 
				        </section>
				    </li>

				    <!--eqblock
				    <li>
				        <section class="block">
									<a href="#"><img src="images/5-thumb.jpg" alt=""  /></a> 
										<h2><a href="#">Tools of the Trade</a></h2> 
										<p>Curabitur in odio augue. Proin metus odio, ultricies eu pharetra dictum, laoreet id odio. Morbi congue auctor interdum. Phasellus sit amet metus justo. </p> 
				        </section>
				    </li>
        
                                         -->
                                    
                                    

				    <!--eqblock-->
                                    
                                    <!--
				    <li>
				        <section class="block">
									<a href="#"><img src="images/6-thumb.jpg" alt=""  /></a> 
										<h2><a href="#">The Art of Making Coffee</a></h2> 
										<p>Proin metus odio, ultricies eu pharetra dictum, laoreet id odio. Phasellus sit amet metus justo. Curabitur in odio augue. Morbi congue auctor interdum.  </p> 
				        </section>
				    </li>
                                    
                                    -->

				    <!--eqblock-->
                                    <!--
				    <li>
				        <section class="block">
									<a href="#"><img src="images/7-thumb.jpg" alt=""  /></a> 
										<h2><a href="#">Coffee Style</a></h2> 
										<p>Proin metus odio, ultricies eu pharetra dictum, laoreet id odio. Curabitur in odio augue. Morbi congue auctor interdum. Phasellus sit amet metus justo. </p> 
				        </section>
				    </li>
                                    
                                    -->
				</ul>
		</section>
    
    
		
	<footer>
    <section>
    <h3>Left Stuff</h3>
    <p>Left aligned text here. Proin metus odio, ultricies eu pharetra dictum, laoreet id odio. Curabitur in odio augue. Morbi congue auctor interdum. Phasellus sit amet metus justo.</p>
    <p>Next line here</p>
    </section>
    
    <section>
    <h3>Center Stuff</h3>
    <p>Center Text here. Proin metus odio, ultricies eu pharetra dictum, laoreet id odio. Curabitur in odio augue. Morbi congue auctor interdum. Phasellus sit amet metus justo.</p>
    <p>Next line here</p>
    </section>
    
    <section>
    <h3>Right Stuff</h3>
    <p>&copy; 2010 <a href="#" title="your site name">yoursite.com</a> All rights reserved.</p>
    <p>Center Text here. Proin metus odio, ultricies eu pharetra dictum, laoreet id odio. Curabitur in odio augue. Morbi congue auctor interdum. Phasellus sit amet metus justo.</p>
    </section>

	</footer>
<!-- Free template created by http://freehtml5templates.com -->
</h:body>
</html>


